(function ($) {
    window.modal = function () {
        var html = '<div class="modal fade" id="[Id]" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">' +
            '<div class="modal-dialog">' +
                '<div class="modal-content">' +
                    '<div class="modal-header">' +
                        '<h5 class="modal-title" id="modalLabel">[Title]</h5>' +
                        '<button type="button" class="close" data-dismiss="modal" aria-label="Close">' +
                            '<span aria-hidden="true">&times;</span>' +
                        '</button>' +
                    '</div>' +
                    '<div class="modal-body">' +
                        '<p>[Message]</p>' +
                    '</div>' +
                    '<div class="modal-footer">' +
                        '<button type="button" class="btn btn-secondary cancel" data-dismiss="modal">[BtnCancel]</button>' +
                        '<button type="button" class="btn btn-primary ok">[BtnOk]</button>' +
                    '</div>'
                '</div>'
            '</div>'
        '</div>'

        var dialogdHtml = '<div id="[Id]" class="modal fade" role="dialog" aria-labelledby="modalLabel">' +
            '<div class="modal-dialog" style="[style];max-width: 100%">' +
                '<div class="modal-content" style="height: 100%;">' +
                    '<div class="modal-header">' +
                        '<h4 class="modal-title" id="modalLabel">[Title]</h4>' +
                        '<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>' +
                    '</div>' +
                    '<div class="modal-body">' +
                    '</div>' +
                '</div>' +
            '</div>' +
        '</div>';
        var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm');
        var generateId = function () {
            var date = new Date();
            return 'mdl' + date.valueOf();
        };
        var init = function (options) {
            options = $.extend({}, {
                title: "操作提示",
                message: "提示内容",
                btnok: "确定",
                btncl: "取消",
                width: 200,
                auto: false
            }, options || {});
            var modalId = generateId();
            var content = html.replace(reg, function (node, key) {
                return {
                    Id: modalId,
                    Title: options.title,
                    Message: options.message,
                    BtnOk: options.btnok,
                    BtnCancel: options.btncl
                }[key];
            });
            $('body').append(content);
            $('#' + modalId).modal({
                width: options.width,
                backdrop: 'static'
            });
            return modalId;
        };

        return {
            alert: function (options) {
                if (typeof options == 'string') {
                    options = {
                        message: options
                    };
                }
                var id = init(options);
                var modal = $('#' + id);
                // modal.find('.ok').removeClass('btn-success').addClass('btn-primary');
                // modal.find('.cancel').hide();

                return {
                    id: id,
                    on: function (callback) {
                        if (callback && callback instanceof Function) {
                            modal.find('.ok').click(function () {
                                callback(true);
                            });
                        }
                    },
                    hide: function (callback) {
                        if (callback && callback instanceof Function) {
                            modal.on('hide.bs.modal', function (e) {
                                callback(e);
                            });
                        }
                    }
                };
            },
            confirm: function (options) {
                var id = init(options);
                var modal = $('#' + id);
                // modal.find('.ok').removeClass('btn-primary').addClass('btn-success');
                // modal.find('.cancel').show();
                modal.on('hide.bs.modal', function (e) {
                    setTimeout(() => {
                        $('body').find('.modal').remove();
                    }, 500)
                });
                return {
                    id: id,
                    on: function (callback) {
                        if (callback && callback instanceof Function) {
                            modal.find('.ok').click(function () {
                                callback(modal, true);
                            });
                            modal.find('.cancel').click(function () {
                                callback(modal, false);
                            });
                        }
                    },
                    hide: function (callback) {
                        if (callback && callback instanceof Function) {
                            modal.on('hide.bs.modal', function (e) {
                                callback(e);
                            });
                        }
                    }
                };
            },
            dialog: function (options) {
                options = $.extend({}, {
                    title: 'title',
                    url: '',
                    style: '',
                    onReady: function () {
                    },
                    onShown: function (e) {
                    }
                }, options || {});
                var modalId = generateId();

                var style = 'width: 100%; height: 100%;';
                var content = dialogdHtml.replace(reg, function (node, key) {
                    return {
                        Id: modalId,
                        Title: options.title,
                        url: options.url,
                        style: options.style ? options.style : style
                    }[key];
                });
                $('body').append(content);
                var target = $('#' + modalId);
                target.modal('show');
                // target.find('.modal-body').load(options.url);
                // if (options.onReady())
                //     options.onReady.call(target);
                // target.modal();
                target.on('shown.bs.modal', function (e) {
                    if (options.onReady(e)) {
                        options.onReady.call(target, e);
                    }
                    setTimeout(() => {
                        $(`#${modalId} .modal-body`).append(`<iframe src="${options.url}" frameborder="0" style="width: 100%; height: 100%;"></iframe>`);
                    }, 0);
                });
                target.on('hide.bs.modal', function (e) {
                    setTimeout(() => {
                        $('body').find('.modal').remove();
                    }, 500)
                });
            }
        }
    }();
})(jQuery);